<?

include 'includes/specs_functions.php';
echo printGoogleAnalytics();

#----------------------------------------------------
# Connect to PADS
$DB = getDB();
#-------------------------------$Session information
$SESSION = get_session($DB);
$THEME = $SESSION->Theme;
$CICUID = $SESSION->Character;
$userAVATAR = $SESSION->GetCharacter('avatar');
#---------------------------------------------------
$version = "?version=3.0";
$version = "?version=".time();
if($THEME=="dark"){
	echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"specs/js/srating/jquery.ui.stars.css.gz?v=3.0.0b38\"/>
	<link href=\"specs/css/main.css.gz".$version."\" rel=\"stylesheet\" type=\"text/css\">
	<link href=\"specs/css/xivspecs_light.css".$version."\" rel=\"stylesheet\" type=\"text/css\">
	<script type=\"text/javascript\" src=\"../css/dark/tracker.css".$version."\"></script>";	
}else{
	echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"specs/js/srating/jquery.ui.stars.white.css?v=3.0.0b38\"/>
	<link href=\"specs/css/main_white.css".$version."\" rel=\"stylesheet\" type=\"text/css\">
	<link href=\"specs/css/xivspecs_light.css".$version."\" rel=\"stylesheet\" type=\"text/css\">
	<script type=\"text/javascript\" src=\"../css/light/tracker.css".$version."\"></script>";	

}

$specId = $_POST['spec'];

$Jtable = SPEC_TBL_JOBS." as job";
$Jcol = array(
		"job.".SPEC_TBL_JOBS_ID." as id"
		,"job.".SPEC_TBL_JOBS_NAME." as name"		
		,"job.".SPEC_TBL_JOBS_TYPE." as type"	
		);
$JorderBy = "job.".SPEC_TBL_JOBS_NAME;
$Jdirection = "ASC";

$Jresult = $DB->GetData($Jtable ,$Jcol ,true ,null, $JorderBy, $Jdirection);
//Show($result);

if($specId != "" && $specId != undefined){
	$table = "(((SELECT * FROM ".SPEC_TBL_SPEC." WHERE ".SPEC_TBL_SPEC_ID." = \"".$specId."\") spec
		LEFT JOIN
		".TBL_CHARACTERS." user
		ON spec.".SPEC_TBL_SPEC_USER_ID." = user.".TBL_CHARACTERS_CICUID.")
		LEFT JOIN 
		".SPEC_TBL_JOBS." jobs
		ON jobs.".SPEC_TBL_JOBS_ID." = spec.".SPEC_TBL_SPEC_JOB_ID.")";
	$col = array(
				"spec.".SPEC_TBL_SPEC_USER_ID." as userId"
				, "jobs.".SPEC_TBL_JOBS_NAME." as jobName"
				, "spec.".SPEC_TBL_SPEC_JOB_ID." as jobId"
				, "user.".TBL_CHARACTERS_NAME." as Name"
				, "user.".TBL_CHARACTERS_AVATAR." as Avatar"
				, "spec.".SPEC_TBL_SPEC_DESCRIPTION." as description"
				, "spec.".SPEC_TBL_SPEC_PUBLIC." as public"
				, "spec.".SPEC_TBL_SPEC_LEVEL." as level"
				);
	$where = array();
	$orderBy = "spec.".SPEC_TBL_SPEC_USER_ID;
	$dir = "ASC";
	
	$result = $DB->GetData($table ,$col ,true ,null, $orderBy, $dir, null);
	
	if ($result[0] == 1){
		foreach ($result[3] as $row) {
			$temp_pub = $row['public'];
			$temp_uid = $row['userId'];
			if($temp_pub == "Y" || $temp_uid == $CICUID){
				$specCICUID = $row["userId"];
				$desc = $row["description"];
				$userName = $row["Name"];
				$userAvatar = $row["Avatar"];
				$specLevel = $row["level"];
				$jobId = $row["jobId"];
				$jobName = $row["jobName"];
			}else{
				$specId = -1;
			}
		}
	}else{
		$specId = -1;
	}
}else{
	$specId = -1;
}
$sowner = 0;
$canRate = false;

$rateValue = 0;
if( $specId != -1 ){
	/* IS LOGGD IN */
	if($specCICUID==$CICUID){
		/* IS OWNER DONT LET HIM RATE */
		$sowner = 1;
	}else if($CICUID != ""){
		$canRate = true;
		/* GET HIS OLD RATING IF THER IS */
		
		$table = SPEC_TBL_RATINGS;
		$col = array(SPEC_TBL_RATINGS_VALUE." as value");
		$where = array(SPEC_TBL_RATINGS_USER_ID."= \"".$CICUID."\"", 
						SPEC_TBL_RATINGS_SPEC_ID ."= \"".$specId."\"");
		$orderBy = SPEC_TBL_RATINGS_VALUE;
		$dir = "ASC";
		$result = $DB->GetData($table ,$col ,true ,$where, $orderBy, $dir, null);
		
		foreach ($result[3] as $row) {
			$rateValue = $row['value'];
		}
	}
}

#------------------------------------------------------------------------
# Disconnect
leaveDB($DB);
?>

<script type="text/javascript" src="../specs/js/xivspecs.js<? echo $version; ?>"></script>
<script type="text/javascript" src="specs/js/spec-tooltip.js<? echo $version; ?>"></script>
<!--DropDown-->
<script type="text/javascript" src="specs/js/dropdown.js<? echo $version; ?>"></script>
<link href="specs/css/dropdown.css" rel="stylesheet" type="text/css">
<!--<script type="text/javascript" src="../specs/js/srating/jquery.ui.stars.js?v=3.0.0b38"></script>
<script type="text/javascript" src="scripts/tooltip/tooltip.js"></script>
<script type="text/javascript" src="scripts/tooltip/tooltip2.js"></script>
<script type="text/javascript" src="scripts/tooltip/tooltip3.js"></script>
<script type="text/javascript" src="../specs/js/jquery.dd.js"></script>
<link href="../specs/css/dd.css" rel="stylesheet" type="text/css">-->
<script type="text/javascript">

	$(document).ready(function(){

		$('.spec_ra').stars({
			cancelShow: false
			,callback: function(ui, type, value){
				/*
				$('#status').html('<div class=\"center loader-gif\" style=\"\"></div>');
				$.post('./specs/xivspecs/save-rating.php', addSessionVars({specId: <? echo $specId; ?>, val: value}),
					function(data){
						if(data.status == 'success'){
							$('#status').html('<div class="success">Rating saved!</div>');
						}else{
							$('#status').html('<div class="error">Please try again!</div>');
						}
					   }, 'json');*/
			}
		});
		$("#main-job").change( function () {
			var id = $(this).val();
			if(id != -1){
				specs.changeMainJob(id);
			}
		});
		$("#sub-job").change( function () {
			//alert($(this).val())
			var id = $(this).val();
			if(id != -1){
				specs.changeSubJob(id);
			}
		});
		$("#load-button").click( function () {
			specs.loadLevels();
		});
		$("#save-button").click( function () {
			if($('#spec-comment-write-container').is(":visible")){
				$('#spec-comment-write-container').fadeOut();
				specs.saveSpec();
			}else{
				$('#spec-comment-write-container').fadeIn();
			}
		});
		$('#write-descr').focus( function(){
			if($(this).html()=="Describe your spec...")
			{
			$(this).html('');
			}
		});
		
		$("#reset-button").click( function () {
			specs.reset();
			//dropdown.reset('main');
			$('#main-ddheader').html('<div id="main-job" name="-1"><img src="../images/icons/ffspecific/leveled_large.png" style="width: 18px;padding-top:0px;"></img><span class="normal-text bold-text" style="margin-left: 8px;">Main Job</span></div>');
			//dropdown.reset('sub');
			$('#sub-ddheader').html('<div id="sub-job" name="-1"><img src="../images/icons/ffspecific/leveled_large.png" style="width: 18px;padding-top:0px;"></img><span class="normal-text bold-text" style="margin-left: 8px;">Sub Job</span></div>');
		});
		$("#main-level").change( function () {
			specs.adjustToMain();
		});
		$("#sub-level").change( function () {
			specs.adjustToSub();
		});
		$("#export-button").click( function () {
			var id = specs.getId();
			if(id != -1){
				$('#status').html('<div class="success"><a href="http://beta.xivpads.com/?Specs&'+id+'&new">http://beta.xivpads.com/?Specs&'+id+'&new</a></div>');
			}else{
				$('#status').html('<div class="error">Save the spec first <br>in order to be able to link it!</div>');
			}
		});
		$("#macro-button").click( function () {
			specs.generateMacro();
		})
		$("#help-button").click( function () {
			if($('#main-level').val() != "" && $('#main-job').attr('name') != "-1" ){
				showSpecPop($('#main-job').attr('name'), $('#main-level').val(), "false");
			}else{
				$('#status').html('<div class="error">Select a main job and level!</div>');
			}
		});
		$(".main-menu").click( function () {
			var id = $(this).attr('name');
			if(id != -1){
				specs.changeMainJob(id);
				$('#main-ddheader').html($(this).clone().css('height','18px').attr('id','main-job'));
			}
			$('#main-ddcontent').mouseout();
		});
		$(".sub-menu").click( function () {
			var id = $(this).attr('name');
			if(id != -1){
				specs.changeSubJob(id);
				$('#sub-ddheader').html($(this).clone().css('height','18px').attr('id','sub-job'));
			}
			$('#sub-ddcontent').mouseout();
		});
		$('.spec-more-comments').click(function() {
			if($('.spec-comment-pane').is(":visible")){
				$('#spec-comments-arrow').removeClass('arrow-down').addClass('arrow-left');
				$('.spec-comment-pane').fadeOut();
			}else{
				$('#spec-comments-arrow').removeClass('arrow-left').addClass('arrow-down');
				$('.spec-comment-pane').fadeIn();
			}
		});
		$('.spec-more-ratings').click(function() {
			if($('.spec-rating-area').is(":visible")){
				$('#spec-ratings-arrow').removeClass('arrow-down').addClass('arrow-left');
				$('.spec-rating-area').fadeOut();
			}else{
				$('#spec-ratings-arrow').removeClass('arrow-left').addClass('arrow-down');
				$('.spec-rating-area').fadeIn();
			}
		});
		
		$('#ability-search').keyup(function(){
				var Na = $(this).val();
				var lvl = $('#sub-level').val() 
				if(lvl == "")
				{
					lvl = 50;
				}
				specs.loadSkillList( -1, lvl, Na );
		});
		
		$('#ability-search').focus(function(){
			if($(this).val() == "Search skills directly..."){
				$(this).val('');
			}
		});
		//specs.loadSkillList(2, 50);
		specs.init(['<?php echo $specLevel ?>', '<?php echo $jobId ?>']);
<?php
	
		if($CICUID != ""){
			echo "$('#save-button').css('opacity','1').attr('disabled', false);
				$('#load-button').css('opacity','1').attr('disabled', false);";	
			if($specId != -1){
				echo "$('.spec-more-comments').show();
					$('.spec-more-ratings').show();";
			}
		}
		if($specId != -1){
			echo "$('#write-descr').val(\"".str_replace("\"", "'", $desc)."\");
			specs.setId('".$specId."');
			$('#save-button').val('Update Spec');
			specs.loadSpec(".$specId.");
			$('#main-ddheader').html('<div id=\"main-job\" name=\"".$jobId."\"><img src=\"".GetClassIcon($jobName)."\" style=\"width: 18px;padding-top:0px;\"></img><span class=\"normal-text bold-text\" style=\"margin-left: 8px;\">".$jobName."</span></div>');
			loadInfoSpecs('".$specId."');";
			}
?>
		$('#show_stat_popup').draggable({cancel: '#spec_popup_body'});
	});
	
	function showSpecPop(jId, lvl, wid) {
		if(jId != ''){
			$("#statListContainer").html("<div style='margin-top:150px;' class=\"center loader-gif\"></div>");
			$.post('specs/xivspecs/get-stats.php', {jobId: jId, level: lvl, wide: wid},
					function (data) {
						specs.displayStatSkills(data, wid);
					
					}, "json");
			$('#show_stat_popup').css('top', (($(window).height() - $('#show_stat_popup').outerHeight()) / 2) + $(window).scrollTop() + 'px');
			$('#show_stat_popup').css('left', (($(window).width() - $('#show_stat_popup').outerWidth()) / 2) + $(window).scrollLeft() + 'px');
			$('#show_stat_popup').fadeIn('fast');
		}else{
			$('#show_stat_popup').fadeOut('fast');
		}
	};
	
</script>
<div class="xivs" id="xivspecs-content" style="height:700px;">
	<div id='show_stat_popup'>
		<div id='stat_skill' class='widget jqDrag' style="width: auto;height: auto;">
			<div id="spec_popup_header" class=' fl-left normal-text bold-text header white' style='font-size:10px;height:10px;'>Recommended skills</div>
			 <a class='close' href="javascript:showSpecPop(0)" style="margin-top: -17px;width: 6px;"><img src='specs/media/cancel.png' style='width: 12px;'/></a>
		</div>
		<div id='spec_popup_body' class='contents' style="min-height: 500px;">
			<div id="statListContainer" style="width: 95%;margin-right: 20px;margin-left: 20px;overflow: auto;float:left;height: 487px;">
				
			</div>
		</div>
	</div>
	<div style="display:inline-block;width: 100%;">
		<div style="margin-bottom: 15px;float:left">
			<table>
				<tr>
					<td colspan='3'> 
						<div class="normal-text bold-text" style="padding: 5px;">Select a main job to start!</div>
					</td>
				</tr>
				<tr>
					<td style="width: 20px;"> 
					</td>
					<td> 
						<dl class="dropdown">
							<dt id="main-ddheader" onmouseover="dropdown.ddMenu('main',1)" onmouseout="dropdown.ddMenu('main',-1)" style="width:114px;">
								<div id="main-job" name="-1"><img src="../images/icons/ffspecific/leveled_large.png" style="width: 18px;padding-top:0px;"></img><span class="normal-text bold-text" style="margin-left: 8px;">Main Job</span></div>
							</dt>
							<dd id="main-ddcontent" onmouseover="dropdown.cancelHide('main')" onmouseout="dropdown.ddMenu('main',-1)">
								<ul>
									<?php foreach ($Jresult[3] as $row): ?>
										
										<li>
											<div class="main-menu" name="<?php echo $row['id']; ?>">
												<img src="<?php echo GetClassIcon($row['name']); ?>"  style='width: 18px;' ></img>
												<span class='normal-text bold-text' style='font-size:10px;'>
													<?php echo $row['name']; ?>
												</span>
											</div>
										</li>

									<?php endforeach; ?>
								</ul>
							</dd>
						</dl>
					</td>
					<td>
						<input id='main-level' type='text' style='width:20px;text-align: center;height: 14px;'>
					</td>
					<td>
					</td>
				</tr>
				<tr>
					<td style="width: 20px;"> 
					</td>
					<td> 
						<dl class="dropdown">
							<dt id="sub-ddheader" onmouseover="dropdown.ddMenu('sub',1)" onmouseout="dropdown.ddMenu('sub',-1)" style="width:114px;">
								<div id="sub-job" name="-1"><img src="../images/icons/ffspecific/leveled_large.png" style="width: 18px;padding-top:0px;"></img><span class="normal-text bold-text" style="margin-left: 8px;">Sub Job</span></div>
							</dt>
							<dd id="sub-ddcontent" onmouseover="dropdown.cancelHide('sub')" onmouseout="dropdown.ddMenu('sub',-1)">
								<ul>
									<?php foreach ($Jresult[3] as $row): ?>
										
										<li>
											<div class="sub-menu" name="<?php echo $row['id']; ?>">
												<img src="<?php echo GetClassIcon($row['name']); ?>" value="<?php echo $row['id']; ?>" style='width: 18px;' ></img>
												<span class='normal-text bold-text' style='font-size:10px;'>
													<?php echo $row['name']; ?>
												</span>
											</div>
										</li>

									<?php endforeach; ?>
								</ul>
							</dd>
						</dl>
					</td>
					<td>
						<input id='sub-level' type='text' style='width:20px;text-align: center;height: 14px;'>
					</td>
					<td>
					</td>
				</tr>
				<tr>
					<td>
					</td>
					<td>
						<span class="normal-text bold-text">Sub skill count: </span>
					</td>
					<td align="right">
						<span id='sub-count' class="normal-text bold-text">0</span>
						<span id="split"></span>
						<span id="sub-max" class="normal-text bold-text">10</span>
					</td>
				</tr>
			</table>
		</div>
		<div id="status" style="float: left;width: 34%;display: inline-block;height: 40px;margin-top: 55px;text-align: center;font-size:10px;margin-left: 23px;" class="normal-text bold-text blue-text">
		</div>
		<div id="delete-area" style="float: left;width: 126px;display: inline-block;height: 115px;margin-left: -198px;margin-top: 19px;display:none;">
			<img style="width: 126px;" src="specs/media/bin.png"></img>
		</div>
		<div style="float:right;margin-right: 12px;">
			<table>
				<tr>
					<td>
						<input id='help-button' type="submit" value='Halp!' style='cursor:pointer;font-size: 10px;'/>
					</td>
					<td>
						<input id='export-button' type="submit" value='Export' style='cursor:pointer;font-size: 10px;'/>
					</td>
					<td>
						<input id='macro-button' type="reset" value='Macro' style='cursor:pointer;font-size: 10px;'/>
					</td>
					<td>
						<input id='reset-button' type="reset" value='Reset' style='cursor:pointer;font-size: 10px;'/>
					</td>
				</tr>
			</table>
			<table id='spec-comment-write-container' style="text-align: right;display:none;">
				<tr>
					<td class='td-table ver-top' style="padding: 0px;margin: 0px;">
						<textarea id='write-descr' style="width: 222px;margin-right: -15px;margin-bottom: -30px;height: 34px;" type='text' >Describe your spec...</textarea>
						 <a href="javascript:$('#spec-comment-write-container').fadeOut();" style=""><img style="width: 7px;" src='specs/media/cancel.png'/></a>
						 <div class="clear:both;" style="height: 29px;"></div>
					</td>
				</tr>
			</table>
			
			<table style="text-align: right;">
				<tr >
					<td>
						<input id='save-button' type="submit" value='Save Spec' disabled style='cursor:pointer;font-size: 10px;opacity:0.5;'/>
					</td>
					<td>
						<input id='load-button' type="submit" value='Load Char' disabled style='cursor:pointer;font-size: 10px;opacity:0.5;'/>
					</td>
				</tr>
			</table>
			<table style="text-align: right;">
				<tr>
					<td class="spec-more-ratings cur-point" style='border-bottom: solid 1px #F4F4F4;padding-bottom: 4px;width: 232px;display:none;' >
						<strong class="normal-text bold-text" style="font-size:10px;margin-right: 10px;">Rate</strong>
						<div id='spec-ratings-arrow' class='fl-right cur-point arrow-left' style='display:inline;margin-top: 4px;'/>
					</td>
				</tr>
				<tr style="text-align: center;">
					<td>
						<div class="spec-rating-area fl-right" style="display:none;padding: 5px;">
							<form class='spec_ra' action='' method='post' style='padding-top: 1px;'>
								<?php foreach (get_options() as $id => $title){
									echo "<input type='radio' name='rate' value='".$id."' id='rate".$id."'";
									if($id==$rateValue){
										echo " checked ";
									}
									echo " />";
								}
								?>
							</form>
						</div>
					</td>
				</tr>
				<tr>
					<td  class="spec-more-comments cur-point" style='border-bottom: solid 1px #F4F4F4;padding-bottom: 4px;width: 232px;display:none;'>
						<strong class="normal-text bold-text" style="font-size:10px;margin-right: 10px;">Comment</strong>
						<div id='spec-comments-arrow' class='fl-right cur-point arrow-left' style='display:inline;margin-top: 4px;'/>
					</td>
				</tr>
			</table>
		</div>
	</div>
	<div class="spec-comment-pane" style="display:none;">
		<table>
			<tr>
				<td class='td-table ver-top' style='padding: 10px;'>
					<a class='cur-point' name='no' ><div class='border-av'><img class='avatar-pic' style='width:36px' src='<?php echo $userAVATAR; ?>'/></div></a>
				</td>
				<td class='td-table ver-top' style='padding-right: 22px; padding-left: 5px; padding-top: 7px;'>
					<textarea id='write-comment' type='text'>Comment...</textarea>
				</td>
			</tr>
		</table>
	</div>
	<script>
		var shiftPressed = false;
		$(window).keydown(function(evt) {
		  if (evt.which == 16) { // shift
			shiftPressed = true;
		  }
		}).keyup(function(evt) {
		  if (evt.which == 16) { // shift
			shiftPressed = false;
		  }
		});
		$('#write-comment').keypress(function(event) {
			if (event.which == 13 && !(shiftPressed)){
				//writeComment(<?php echo $specId; ?>, $(this).val()) /*ENABLE ON 1.20*/
				event.preventDefault();
			}
		});

		$('#write-comment').focus(function(){
			if($(this).val() == "Comment..."){
				$(this).val('');
			}
		});
	</script>
	<div class="clear:both;"></div>
	<div style="width:100%;text-align:right;">
		<input id="ability-search" class="forms normal-text bold-text" type="text"  value="Search skills directly..." style="width:230px;font-size: 9px;" maxlength="255">
	</div>
	<div id="gridContainer" style="float:left;width: 496px;">
		<div style="padding:5px;">
		</div>
		<div id="gridContainer-main"> </div>
	</div>
	
	<div id="abilityListContainer" style="float:right;width: 216px;height: 500px;overflow: auto;"> </div>
</div>